<!--
  ~
  ~   ~ MIT License
  ~   ~
  ~   ~ Copyright (c) 2021-2022 yangrunkang
  ~   ~
  ~   ~ Author: yangrunkang
  ~   ~ Email: yangrunkang53@gmail.com
  ~   ~
  ~   ~ Permission is hereby granted, free of charge, to any person obtaining a copy
  ~   ~ of this software and associated documentation files (the "Software"), to deal
  ~   ~ in the Software without restriction, including without limitation the rights
  ~   ~ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  ~   ~ copies of the Software, and to permit persons to whom the Software is
  ~   ~ furnished to do so, subject to the following conditions:
  ~   ~
  ~   ~ The above copyright notice and this permission notice shall be included in all
  ~   ~ copies or substantial portions of the Software.
  ~   ~
  ~   ~ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  ~   ~ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  ~   ~ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  ~   ~ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  ~   ~ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  ~   ~ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  ~   ~ SOFTWARE.
  ~
  -->

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<body>

<div th:fragment="render_user_list(memberEnhanceList)">
    <ul class="list-group list-group-flush" th:if="!${#lists.isEmpty(memberEnhanceList)}">
        <li class="list-group-item p-0" th:each="memberEnhance,ite : ${memberEnhanceList}">
            <div th:if="${memberEnhance.member.userId == 'google-ad-feed'}" th:include="fragments/index::google_feed_ad"></div>
            <div th:if="${memberEnhance.member.userId != 'google-ad-feed'}" class="d-flex align-items-center my-1 ">
                <img class="lazyload img rounded cv-icon-50 me-1"
                     th:if="!${#strings.isEmpty(memberEnhance.member.via)}"
                     th:data-src="${memberEnhance.member.via}"
                     th:alt="${memberEnhance.member.userName}"
                />
                <div class="flex-grow-1">
                    <a th:href="@{'/profile/'+${memberEnhance.member.userId}+'/content'}" class="cv-link fs-6 fst-normal"
                       th:title="${memberEnhance.member.userName} + ' ' + ${#strings.isEmpty(memberEnhance?.memberExtendEnhance?.memberExtend?.introduce)?'':memberEnhance?.memberExtendEnhance?.memberExtend?.introduce}">
                        <span>[[${memberEnhance.member.userName}]]</span>
                        <span th:include="fragments/member::memberTag(${memberEnhance})"></span>
                    </a>
                    <div class="text-black-50"
                         th:text="${#strings.isEmpty(memberEnhance?.memberExtendEnhance?.memberExtend?.introduce)?'该用户暂未填写个人简介':memberEnhance?.memberExtendEnhance?.memberExtend?.introduce}">
                    </div>
                </div>
                <span class="text-black-50 small" th:if="!${#strings.isEmpty(memberEnhance?.lastLoginDate)}"
                      th:text="${memberEnhance?.lastLoginDate}+' 活跃'">最近活跃时间</span>&nbsp;&nbsp;&nbsp;
                <a class="btn rounded-3 bg-gradient btn-warning btn-sm"
                   th:href="'/profile/' + ${memberEnhance.member.userId}+'/message'" th:inline="text">
                    <img th:data-src="${ossStatic} + @{/icons/system/goutong.png}" class="lazyload cv-icon-item"
                         alt="留言"/> 留言
                </a>
            </div>
        </li>
    </ul>
    <div th:if="${#lists.isEmpty(memberEnhanceList)}" th:include="fragments/index::empty_content"></div>
</div>

<!--用户标签-->
<div th:fragment="memberTag(memberEnhance)">
    <span th:include="fragments/member::memberAdmin(${memberEnhance.member.isAdmin})"></span>
    <span th:include="fragments/member::memberActive(${memberEnhance.active})"></span>
</div>

<div th:fragment="memberActive(active)">
    <span th:if="${active}" class="badge bg-gradient rounded-3 bg-info fw-light small">online</span>
</div>

<div th:fragment="memberAdmin(isAdmin)">
    <span th:if="${isAdmin.name()== 'ADMIN'}" class="badge bg-gradient rounded-3 bg-dark text-white fw-light small">admin</span>
</div>


<div th:fragment="memberEmail">
    <div class="ui left icon input fluid">
        <input type="email" id="email" placeholder="邮箱">
        <i class="bi bi-envelope icon"></i>
    </div>
</div>

<div th:fragment="memberVerifyCode">
    <div class="ui action fluid input">
        <input type="text" placeholder="输入验证码" id="verifyCode">
        <button class="ui button" id="send-verify-code-btn" onclick="sendVerifyCode()">发送验证码</button>
    </div>
</div>




</body>
</html>
